<!DOCTYPE html>
<html lang="zh" xmlns:th="http://www.thymeleaf.org" xmlns:shiro="http://www.pollix.at/thymeleaf/shiro">
<head>
    <th:block th:include="include :: header('设备管理列表')" />
</head>
<body class="gray-bg">

    <div class="ui-layout-west">
        <div class="box box-main">
            <div class="box-header">
                <div class="box-title">
                    <i class="fa icon-grid"></i> 组织机构
                </div>
                <div class="box-tools pull-right">
                    <a type="button" class="btn btn-box-tool" href="#" onclick="dept()" title="管理部门"><i class="fa fa-edit"></i></a>
                    <button type="button" class="btn btn-box-tool" id="btnExpand" title="展开" style="display:none;"><i class="fa fa-chevron-up"></i></button>
                    <button type="button" class="btn btn-box-tool" id="btnCollapse" title="折叠"><i class="fa fa-chevron-down"></i></button>
                    <button type="button" class="btn btn-box-tool" id="btnRefresh" title="刷新部门"><i class="fa fa-refresh"></i></button>
                </div>
            </div>
            <div class="ui-layout-content">
                <div id="tree" class="ztree"></div>
            </div>
        </div>
    </div>
<!--    <button id="111">11111111111</button>
    <button id="222">22222222222</button>-->
     <div class="container-div">
        <div class="row">
            <div class="col-sm-12 search-collapse">
                <form id="formId">
                    <div class="select-list">
                        <ul>
                            <li>
                                <label>领用单位：</label>
                                <input type="text" name="lingyong"/>
                            </li>
                            <li>
                                <label>仪器名称：</label>
                                <input type="text" name="name"/>
                            </li>
                            <li>
                                <label>分类号：</label>
                                <input type="text" name="fenleihao"/>
                            </li>
                            <li>
                                <label>型号：</label>
                                <input type="text" name="xinghao"/>
                            </li>
                            <li>
                                <label>规格：</label>
                                <input type="text" name="guige"/>
                            </li>
                            <li>
                                <label>单价：</label>
                                <input type="text" name="danjai"/>
                            </li>
                            <li>
                                <label>厂家：</label>
                                <input type="text" name="changjia"/>
                            </li>
                            <li class="select-time">
                                <label>购置日期：</label>
                                <input type="text" class="time-input" id="startTime" placeholder="开始时间" name="params[beginGouzhiriqi]"/>
                                <span>-</span>
                                <input type="text" class="time-input" id="endTime" placeholder="结束时间" name="params[endGouzhiriqi]"/>
                            </li>
                            <li>
                                <label>现状：</label>
                                <input type="text" name="xianzhunag"/>
                            </li>
                            <li>
                                <label>经费科目：</label>
                                <input type="text" name="jingfeikemu"/>
                            </li>
                            <li>
                                <label>使用方向：</label>
                                <input type="text" name="shiyongfangxinag"/>
                            </li>
                            <li>
                                <label>设备来源：</label>
                                <input type="text" name="laiyuan"/>
                            </li>
                            <li>
                                <label>领用人：</label>
                                <input type="text" name="lingyongren"/>
                            </li>
                            <li>
                                <label>经手人：</label>
                                <input type="text" name="jingshouren"/>
                            </li>
                            <li>
                                <label>记帐人：</label>
                                <input type="text" name="jizhangren"/>
                            </li>
                            <li>
                                <label>输入人：</label>
                                <input type="text" name="shururen"/>
                            </li>
                            <li class="select-time">
                                <label>入库时间：</label>
                                <input type="text" class="time-input" id="startTime" placeholder="开始时间" name="params[beginRukushijian]"/>
                                <span>-</span>
                                <input type="text" class="time-input" id="endTime" placeholder="结束时间" name="params[endRukushijian]"/>
                            </li>
                            <li>
                                <label>单据号：</label>
                                <input type="text" name="danjuhao"/>
                            </li>
                            <li>
                                <label>存放地名称：</label>
                                <input type="text" name="cunfangdi"/>
                            </li>
                            <li>
                                <label>备注：</label>
                                <input type="text" name="beizhu"/>
                            </li>
                            <li>
                                <a class="btn btn-primary btn-rounded btn-sm" onclick="$.table.search()"><i class="fa fa-search"></i>&nbsp;搜索</a>
                                <a class="btn btn-warning btn-rounded btn-sm" onclick="$.form.reset()"><i class="fa fa-refresh"></i>&nbsp;重置</a>
                            </li>
                        </ul>
                    </div>
                </form>
            </div>

            <div class="btn-group-sm" id="toolbar" role="group">
                <a class="btn btn-success" onclick="$.operate.add()" shiro:hasPermission="equipment:equipment:add">
                    <i class="fa fa-plus"></i> 添加
                </a>
                <a class="btn btn-primary single disabled" onclick="$.operate.edit()" shiro:hasPermission="equipment:equipment:edit">
                    <i class="fa fa-edit"></i> 修改
                </a>
                <a class="btn btn-danger multiple disabled" onclick="$.operate.removeAll()" shiro:hasPermission="equipment:equipment:remove">
                    <i class="fa fa-remove"></i> 删除
                </a>
                <a class="btn btn-warning" onclick="$.table.exportExcel()" shiro:hasPermission="equipment:equipment:export">
                    <i class="fa fa-download"></i> 导出
                </a>
            </div>
            <div class="col-sm-12 select-table table-striped">
                <table id="bootstrap-table"></table>
            </div>
        </div>
    </div>
    <th:block th:include="include :: footer" />
    <script th:inline="javascript">
        var editFlag = [[${@permission.hasPermi('equipment:equipment:edit')}]];
        var removeFlag = [[${@permission.hasPermi('equipment:equipment:remove')}]];
        var prefix = ctx + "equipment/equipment";

        $(function() {
            var options = {
                url: prefix + "/list",
                createUrl: prefix + "/add",
                updateUrl: prefix + "/edit/{id}",
                removeUrl: prefix + "/remove",
                exportUrl: prefix + "/export",
                modalName: "设备管理",
                showFooter:true, //开启底部
                columns: [{
                    checkbox: true
                },
                {
                        field: 'bianhao',
                        title: '编号',
                        visible: false

                 },
                {
                    field: 'lingyong',
                    title: '领用单位'
                },
                {
                    field: 'name',
                    title: '仪器名称'
                },
                {
                    field: 'fenleihao',
                    title: '分类号'
                },
                {
                    field: 'xinghao',
                    title: '型号',
                    footerFormatter:function (data) {
                        //debugger;
                        let sum = 0;
                        for (let i = 0; i < data.length; i++) {
                            sum += Number(data[i].xinghao);
                        }
                        return "总和" + sum;
                    }
                },
                {
                    field: 'guige',
                    title: '规格'
                },
                {
                    field: 'danjai',
                    title: '单价'
                },
                {
                    field: 'changjia',
                    title: '厂家'
                },
                {
                    field: 'gouzhiriqi',
                    title: '购置日期'
                },
                {
                    field: 'xianzhunag',
                    title: '现状'
                },
                {
                    field: 'jingfeikemu',
                    title: '经费科目'
                },
                {
                    field: 'shiyongfangxinag',
                    title: '使用方向'
                },
                {
                    field: 'laiyuan',
                    title: '设备来源'
                },
                {
                    field: 'lingyongren',
                    title: '领用人'
                },
                {
                    field: 'jingshouren',
                    title: '经手人'
                },
                {
                    field: 'jizhangren',
                    title: '记帐人'
                },
                {
                    field: 'shururen',
                    title: '输入人'
                },
                {
                    field: 'rukushijian',
                    title: '入库时间'
                },
                {
                    field: 'danjuhao',
                    title: '单据号'
                },
                {
                    field: 'cunfangdi',
                    title: '存放地名称'
                },
                {
                    field: 'beizhu',
                    title: '备注'
                },
                {
                    title: '操作',
                    align: 'center',
                    formatter: function(value, row, index) {
                        var actions = [];
                        actions.push('<a class="btn btn-success btn-xs ' + editFlag + '" href="javascript:void(0)"' +
                            ' onclick="$.operate.edit(\'' + row.bianhao + '\')"><i class="fa fa-edit"></i>编辑</a> ');
                        actions.push('<a class="btn btn-danger btn-xs ' + removeFlag + '" href="javascript:void(0)" ' +
                            'onclick="$.operate.remove(\'' + row.bianhao + '\')"><i class="fa fa-remove"></i>删除</a>');
                        return actions.join('');
                    }
                }]
            };
            $.table.init(options);
        });

/*        //为按钮绑定点击事件
        $("#111").click(function () {
            //调用modal打开添加设备管理页面。
            $.modal.open("添加设备管理",prefix+"/add",400,300,function (index,layero) {
                //演示遮罩层,让它五秒后关闭
                $.modal.loading("加载中")
                //通过回调函数，拿到iframe这个页面，的document
                var mydoc = layero.find('iframe')[0].contentWindow.document;
                //通过document拿到input标签的名字 打印出来
                let elementsByTagName = mydoc.getElementsByTagName("input");
                for (let i = 0; i < elementsByTagName.length ; i++) {
                    console.log($(elementsByTagName[i]).val())
                }
                setTimeout(function () {
                    $.modal.closeLoading()
                },5000)

                layer.close(index)
            })
        })

        //演示选中获取行数据，选中表单行，点击222222按钮，即可打印出数据
        $("#222").click(function () {
            //通过bootstraptable的getSelections方法，选中行的数据获取
            let rows = $("#bootstrap-table").bootstrapTable('getSelections');
            //通过数组中的map方法，获取数组中每个对象的id值，并在中间添加逗号将数组拼接成字符串
            let ids = rows.map(item => item.id).join(",")
            //发送post请求给后台，传递ids，利用回调函数，展示删除结果。

/!*            $.post("/user/delete",{ids:ids},function (data) {
                $.modal.msgSuccess(data.msg())
            })*!/
            console.log(rows)
            console.log(ids)
        })*/

        /* 设备管理-部门 */
        function dept() {
            var url = ctx + "system/dept";
            $.modal.openTab("部门管理", url);
        }
    </script>
</body>
</html>